import { logErrorType } from 'codemirror-editor-vue3';
<template>
  <v-container fill-height fluid>
    <v-row align="center" justify="center">
      <v-col cols="12" sm="10" md="11">
        <v-textarea
          clearable
          clear-icon="mdi-close-circle"
          label="请输入信息"
          v-model="inputData"
          rows="6"
          @input="ChangeCode"
        ></v-textarea>
      </v-col>
    </v-row>
  </v-container>

  <div class="container">
    <v-chip
      class="ma-2"
      color="teal"
      text-color="white"
      prepend-icon="mdi-checkbox-marked-circle"
      v-model="chipText"
      @click="jumpurl"
    >
      {{ chipText }}
    </v-chip>
  </div>
</template>

<script>
import axios from "axios";

export default {
  data() {
    return {
      inputData: "",
      chipText: "默认初始化信息",
      url: "",
    };
  },
  methods: {
    ChangeCode() {
      axios
        .post("/api/loginCode", { logindict: this.inputData })
        .then((response) => {
          console.log(this.inputData, response);
          const data = response.data.data.loginCode;
          const loginurl = data.jump_url;
          this.url = loginurl;
          this.chipText = data;
        })
        .catch(() => {
          // 处理请求错误
          this.chipText = "";
        });
    },
    jumpurl() {
      window.open(this.url);
    },
  },
};
</script>

<style>
.container {
  display: flex;
  justify-content: center; /* 水平居中对齐 */
  align-items: center; /* 垂直居中对齐 */
  padding-bottom: 5%;
  padding-top: 1%;
}
.containertext {
  width: 70%; /* 设置宽度为 70% */
}
</style>
